<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page language="java" import="java.util.*"%>
<%@ page isELIgnored="false"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
	String path = request.getContextPath();
%>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>消息列表</title>
	<link rel="stylesheet" type="text/css" href="<%=path %>/CSS/backMange.css">
	<!-- css资源 -->
	<link rel="stylesheet" type="text/css" href="<%=path %>/easyUI1.4.1/themes/default/easyui.css">
	<!-- 图标资源 -->
	<link rel="stylesheet" type="text/css" href="<%=path %>/easyUI1.4.1/themes/icon.css">
	<!-- 下拉 -->
	<link rel="stylesheet" type="text/css"href="<%=path %>/common/lowSelect/lib/css/htools.select.skin.css">
	<style type="text/css">
		.hideClass{display:none}
		.setFont .textbox .textbox-text{font-size: 15px;padding-left:20px;padding-top:1px;height:30px}/* 微调器字体样式 */
		.datagrid-cell{font-size: 14px}
		.datagrid-cell,
		.datagrid-cell-group,
		.datagrid-header-rownumber,
		.datagrid-cell-rownumber {font-size: 14px;}
		.datagrid-header .datagrid-cell span {font-size: 14px;}

		.seachform li{float:left; margin-right:15px;}
		.scinput1{width:150px; height:26px; border:solid 1px #ced9df;background-color: white;}
		input[type="text"] {background-color: #fff;border-top: solid 1px #a7b5bc;border-left: solid 1px #a7b5bc;border-right: solid 1px #ced9df;border-bottom: solid 1px #ced9df;}
		ul{display:block;margin:0;padding:0;list-style:none;}
		li{display:block;margin:0;padding:0;list-style: none;}
	</style>
	<script type="text/javascript" src="<%=path %>/easyUI1.4.1/jquery.min.js"></script>
	<!-- 下拉 -->
	<script type="text/javascript" src="<%=path %>/common/lowSelect/lib/js/jquery.htools.select.js"></script>
	<!--EasyUI的js包 -->
	<script type="text/javascript"
			src="<%=path %>/easyUI1.4.1/jquery.easyui.min.js"></script>
	<!-- 本地语言 -->
	<script type="text/javascript"
			src="<%=path %>/easyUI1.4.1/locale/easyui-lang-zh_CN.js"></script>

	<script type="text/javascript" src="<%=path %>/common/lowSelect/lib/js/jquery.htools.select.js"></script>

	<script type="text/javascript" src="<%=path%>/My97DatePicker/WdatePicker.js"></script>
	<%@ include file="/WEB-INF/JSP/ajax.jsp"%>
	<script type="text/javascript">

        //IE不支持console对象，此代码仅为测试使用
        ///////////////////////////////////////
        window.console = window.console || (function () {
            var c = {}; c.log = c.warn = c.debug = c.info = c.error = c.time = c.dir = c.profile
                = c.clear = c.exception = c.trace = c.assert = function () { };
            return c;
        })();

        $(function(){

            //获取父菜单
            $("#message_list_table").datagrid({
                url:'<%=path %>/DrivingSys/message/list.action',  //数据来源
                //冻结列
                columns:[[
                    //{field: 'ck', checkbox: true, width: '30' },  //复选框
                    {field:'type',title:'消息类型',width:40,sortable :true
                        ,align:'center',
                        formatter:function(value,row,index){
                            if(value=='1'){return '单据'}
                            else if(value=='2'){return '通知'}
                        }},
                    {field:'islook',title:'状态',width:40,sortable :true
                        ,align:'center',
                        formatter:function(value,row,index){
                            if(value=='1'){return '已读'}
                            else if(value=='0'){return '未读'}}},
                    {field:'creatTime',title:'时间',width:60,align:'center',sortable :true},
                    {field:'message',title:'内容',width:250,align:'center',sortable :true},
                    {field:'id',title:'操作',width:40,align:'center',
                        formatter : function(value, row, index) {
                            if(row.type == '1')
                            {
                                return "<div style='cursor: pointer;background-color: #57a0ff; text-align: center;color: #ffffff;width:48px ;margin: auto;' onclick='toURL(\""+"<%=path%>/DrivingSys"+row.url+"\",\""+row.id+"\",\""+row.islook+"\")'>查看</div>"
                                //return "<a style='width:58px ;cursor:hand' onclick='toURL(\""+"<%=path%>/DrivingSys"+row.url+"\")'>查看</a>"
                            }else{
                                return '';
                            }
                        }
                    }
                ]],
                // width:330,
                //  height:200,
                fitColumns:true,//自适应宽度，占满,不能和冻结列同时设置成true
                fit:true,//充满屏幕
                striped:true,   //斑马线效果
                idField:'id',    //主键列
                rownumbers:true,            //显示行号
                singleSelect:true,          //是否单选
                //cache:false,				//关闭缓存
                method:'post',
                pagination:true,
                pageList:[10,20,50,100],//每页行数选择列表
                pageSize:20, //设置默认初始的每页行数rows
                pageNumber:1,//设置默认初始的页码page
                remoteSort:true,    //是否服务器端排序，设成false才可以在页面进行排序
                //sortName:'fisAdmin', //指定列名可以进行排序
                multiSort:true ,

                //额外参数
                queryParams: {
                    'ISLOOK': $("#ISLOOK_id").val(),
                    'TYPE': $("#TYPE_id").val()
                },

                onLoadSuccess:function(){
                    //$('#Pmessage_list_table').datagrid('clearSelections');
                    return false;
                },
                //双击
                onDblClickRow : function(index, row){
                    var thisBean = $('#message_list_table').datagrid('getSelections')[0];

                    $("#message_window_div_id").attr("style","width:350px;height:300px;");
                    $('#message_window_div_id').window('open');

                    $.ajax({
                        url:'<%=path%>/DrivingSys/message/detail.action',
                        type: "post",
                        dataType:"json",
                        //timeout : 10000,
                        data:{"id":thisBean.id},
                        success: function(json) {
                            console.log(json);
                            $("#message_type_id").val(json.type);
                            $("#creat_time_id").val(json.creatTime);
                            $("#state_id").val(thisBean.islook);
                            $("#message_id").val(json.message);
                            if(row.type == '0')
                            {
                                //重置顶部个人消息。
                                window.parent.parent.frames['topFrame'].top_setMessage_Flag(false);
                            }

                        }
                    });

                    //$('#Pmenu_window_div').window('close');
                },loadMsg:'请稍候...'
            })
        });
	</script>
</head>
<body style=" margin:0px;  overflow:hidden;">
<table id="message_list_table" toolbar="#tb"style="font-size: 14px;">
</table>
<div id="tb"style="background-color: #f5f5f5;">
	<div style="background-color: #fff;border-radius:10px 10px 0 0;padding-top:10px;padding-left:10px">
		<table>
			<tr >
				<td width="180px">
					<div style="float:left;margin:5px 5px 0 10px ;font-size:14px">消息类型</div>
					<select id="TYPE_id">
						<option value="no" selected>全部</option>
						<option value="2">通知</option>
						<option value="1">单据</option>
					</select>
				</td>
				<td width="180px">
					<div style="float:left;margin:5px 5px 0 10px ;font-size:14px">消息状态</div>
					<select id="ISLOOK_id">
						<option value="no" selected>全部</option>
						<option value="0">未读</option>
						<option value="1">已读</option>
					</select>
				</td>
				<td height="44px">

					<%--<input class="easyui-datebox" id="search_messageBeginTime"style="width:110px;"
                           data-options="validType:'testDate[\'#search_messageBeginTime\']'">

                    <input class="easyui-datebox" id="search_messageEndTime"style="width:110px;"
                           data-options="validType:'testDate[\'#search_messageEndTime\']'">--%>
					<ul class="seachform">
						<li>
							<div style="float:left;margin:5px 5px 0 10px ;font-size:14px">开始时间</div>
							<input class="scinput1"  name="beginTime" type="text" onfocus="WdatePicker({maxDate:'#F{$dp.$D(\'search_messageEndTime\')||\'%y-%M-%d\'}',dateFmt:'yyyy-MM-dd'})"
								   id="search_messageBeginTime" class="input-text Wdate" style="width:150px;" value="">
						</li>
						<li>
							<div style="float:left;margin:5px 5px 0 10px ;font-size:14px">结束时间</div>
							<input class="scinput1"  name="endTime" type="text" onfocus="WdatePicker({minDate:'#F{$dp.$D(\'search_messageBeginTime\')}',maxDate:'%y-%M-%d',dateFmt:'yyyy-MM-dd'})"
								   id="search_messageEndTime" class="input-text Wdate" style="width:150px;"value="">
						</li>
					</ul>



				</td>

				<td>
					<input type="button"value="立即搜索" onclick="doSearch()"
						   style="width:100px;height:32px;outline:none;border:none;background-image: url(<%=path %>/images/myimages/button.jpg) ;background-position:0px -45px;cursor:pointer;color: #fff;border-radius:20px;padding:5px 21px"/>
				</td>
			</tr>
		</table>
	</div>
</div>

<!-- 隐藏的详情窗口 -->
<div id="message_window_div_id" class="easyui-window user_set_windows" title="消息详情"
	 data-options="modal:true,closed:true,iconCls:'icon-save',top:120" style="width:350px;height:390px;display:none">
	<div style="padding:5px 10px 0px 20px">
		<form id="add_window_form" method="post"style="width:305px;height:250px">
			<table >
				<tr height="40px">
					<td width="30%" class="td_r">类型:</td>
					<td width="70%" class="td_l">
						<select class="all_select" id="message_type_id">
							<option value="1">&nbsp;&nbsp;单据&nbsp;&nbsp;</option>
							<option value="2">&nbsp;&nbsp;通知&nbsp;&nbsp;</option>
						</select>
					</td>
				</tr>
				<tr height="40px" >
					<td width="30%" class="td_r"><b>*</b>消息状态:</td>
					<td width="70%" class="td_l">
						<select class="all_select" id="state_id">
							<option value="0">&nbsp;&nbsp;未读&nbsp;&nbsp;</option>
							<option value="1">&nbsp;&nbsp;已读&nbsp;&nbsp;</option>
						</select>
					</td>
				</tr>
				<tr id="add_trisdelete_id">
					<td width="30%" class="td_r">消息时间:</td>
					<td width="70%" class="td_l">
						<input type="text" value=""id="creat_time_id" />
					</td>
					</td>
				</tr>

				<tr>
					<td width="30%" class="td_r">内容:</td>
					<td  width="70%" class="td_l">
						<textarea id="message_id" style="width:100%;resize:none"rows="7"></textarea>
					</td>
				</tr>
			</table>
		</form>
		<div style="text-align:center;padding:5px">
			<%--<a href="javascript:void(0)" class="easyui-linkbutton"style="margin-right:100px;width:70px;height:30px;" onclick="submitForm()">提交</a>--%>
			<a href="javascript:void(0)" class="easyui-linkbutton"style="width:70px;height:30px;" onclick="javascript:$('#message_window_div_id').window('close')">关闭</a>
		</div>
	</div>
</div>
</body>
<script>


    var $searchTypeSelect = $("#TYPE_id");
    /**
     * 初始化插件
     */
    $searchTypeSelect.goSelectInput({
        height: 30,
        width: 90
    });

    var $searchISLOOKSelect = $("#ISLOOK_id");
    /**
     * 初始化插件
     */
    $searchISLOOKSelect.goSelectInput({
        height: 30,
        width: 90
    });


    function toURL(url,id,islook) {
        if(islook == '0'){
            $.ajax({
                url:'<%=path%>/DrivingSys/message/update.action',
                type: "post",
                dataType:"json",
                //timeout : 10000,
                data:{"id":id},
                success: function(json) {
                }
            });
            //重置顶部个人消息。
            window.parent.parent.frames['topFrame'].top_setMessage_Flag(false);
        }

        window.location.href=url;
    }


    //分页查询
    function doSearch(){
        var ISLOOK = $searchISLOOKSelect.val();
        var TYPE = $searchTypeSelect.val();
        var messageBegin = $("#search_messageBeginTime").val();
        var messageEnd = $('#search_messageEndTime').val();

        console.log(messageBegin);
        //保留页码查询
        $('#message_list_table').datagrid('reload',{
            ISLOOK: ISLOOK,
            messageBegin: messageBegin,
            messageEnd: messageEnd,
            TYPE:TYPE
        });
    }
</script>
</html>